<template>
    <div class="father">
        <div class="bottom">
            <ul>
                <li>
                    <img src="../../local/1.png" alt="">

                </li>
                <li>
                    <img src="../../local/2.png" alt="">

                </li>
                <li>
                    <img src="../../local/3.png" alt="">

                </li>
                <li>
                    <img src="../../local/4.png" alt="">

                </li>
                <li>
                    <img src="../../local/5.png" alt="">

                </li>
            </ul>
        </div>
    </div>
</template>

<script>
export default {
    name: 'Footert',
    components: {

    }
}
</script>

<style lang="scss" scoped>
.father {
    position: relative;

    .bottom {
        
        width: 100%;
        height: 60px;
        background-color: salmon;
        line-height: 60px;
        position: absolute;
        bottom: 0;
        left: 0;
        
        position: fixed;
        bottom: 0;
        left: 0;

        ul {
            margin: 0 auto;
            padding: 0;
            width: 300px;
            list-style: none;
            display: flex;
            height: 60px;
            justify-content: space-evenly;
            align-items: center;

            li {
                height: 60px;
                img {
                    width: 70px;
                    height: 60px;
                    background-size: 100% 100%;
                }

            }
        }
    }
}
</style>